<template>
  <div >
     <!--头部导航--> 
   <header> 
    <div class="sui-navbar wrapper"> 
     <div class="navbar-inner"> 
      <a href="index-logined.html" class="sui-brand"><img style="width:150px" src="~assets/img/asset-logo-black.png" alt="社交" /></a> 

        <ul class="sui-nav"> 
            <router-link to="/" tag="li" active-class="active" exact><a>头条</a></router-link>
            <router-link to="/article" tag="li" active-class="active"><a>博客</a></router-link>
            <router-link to="/spit" tag="li" active-class="active"><a>吐槽</a></router-link>
            <router-link to="/friends" tag="li" active-class="active"><a>交友</a></router-link>
            <router-link to="/gathering" tag="li" active-class="active"><a>活动</a></router-link>
            <!-- <router-link to="/qa" tag="li" active-class="active"><a>问答</a></router-link> -->
            <!-- <router-link to="/recruit" tag="li" active-class="active"><a>招聘</a></router-link>  -->
        </ul>


      <form class="sui-form sui-form pull-left"> 
       <input type="text"  placeholder="输入关键词..." /> 
       <span class="btn-search fa fa-search"></span> 
      </form> 


      <div class="sui-nav pull-right info" v-if="user.name!==undefined"> 
        <li><a href="/manager" target="_blank" class="notice"><font color="black" font-family="Microsoft Yahei" size="5px" style="size:5px">{{user.name}}</font></a></li> 
        <li><a href="/manager" target="_blank" class="homego"><img :src="user.avatar" alt="用户头像" width="60px" height="60px" /></a></li>
        <!-- <router-link @click="loginout" >退出</router-link> -->
        <li><button class="sui-btn btn-login" @click="loginout" >退出</button></li>
      </div>

      <div class="sui-nav pull-right info" v-if="user.name===undefined"> 
        <li><router-link to='/register'>注册</router-link> </li>
        <li><router-link  class="sui-btn btn-login" to='/login'>登录</router-link> </li> 
      </div>
      

     </div> 
    </div> 
   </header> 


   
    <nuxt/>


    <!-- 脚部-->
     <div class="footer"> 
      <div class="wrapper"> 
        <div class="footer-bottom"> 
        <div class="link"> 
          <dl> 
          <dt>
            网站相关
          </dt> 
          <dd>
            关于我们
          </dd> 
          <dd>
            服务条款
          </dd> 
          <dd>
            帮助中心
          </dd> 
          <dd>
            编辑器语法
          </dd> 
          </dl> 
          <dl> 
          <dt>
            常用链接
          </dt> 
          <dd>
            <a>码云</a>
          </dd> 
          </dl> 
          <dl> 
          <dt>
            联系我们
          </dt> 
          <dd>
            联系我们
          </dd> 
          <dd>
            加入我们
          </dd> 
          <dd>
            建议反馈
          </dd> 
          </dl> 
          <dl> 
          <dt>
            关注我们
          </dt> 
          <dd>
            微博
          </dd> 
          <dd>
            twitter
          </dd> 
          </dl> 
          <div class="xuke"> 
          <h3>内容许可</h3> 
          <p>除特别说明外，用户内容均采用知识共享署名-非商业性使用-禁止演绎4.0 国际许可协议 (CC BY-NC-ND 4.0) 进行许可</p> 
          <p>本站由 码云用户KakiNaKajima 提供更新服务</p> 
          </div> 
        </div> 
        <p class="Copyright">Copyright &copy; 20200329 Kaki博客 Kaki新闻 参天大树考试系统 当前版本 v2.0.1</p> 
        </div> 
      </div> 
  </div> 
 
  </div>
</template>

<script>
import '@/assets/plugins/normalize-css/normalize.css'
import '@/assets/plugins/yui/cssgrids-min.css'
import '@/assets/plugins/sui/sui.min.css'
import '@/assets/plugins/sui/sui-append.min.css'
import '@/assets/plugins/font-awesome/css/font-awesome.min.css'
import '@/assets/css/widget-base.css'
import '@/assets/css/widget-head-foot.css'
import '@/assets/css/page-sj-headline-login.css' 

import {getUser,removeUser} from '@/utils/auth'

export default {
    data(){
      return{
         user:{}
      }
    },
    created(){
        this.user = getUser()
    },
    methods:{
      loginout(){
         removeUser()
         //刷新页面
         //location.href="/login"
         //this.$router.push('/')
           this.$router.push('/login')
      }
    }
}
</script>

